<template>
  <view>
    <view v-if="pageShow" class="am-flex-rc-center loading-wrap"
      ><u-loading size="50" mode="flower" color="#FE6507"></u-loading
    ></view>
    <view v-else>
      <view class="banner_wrap" v-if="bannerList.length">
        <swiper
          :indicator-dots="indicatorDots"
          class="swiper"
          style="height: 906rpx"
          :autoplay="autoplay"
          :interval="interval"
          :duration="duration"
        >
          <swiper-item
            v-for="(item, ind) in bannerList"
            :key="item.id"
            @click="goDetail(item)"
          >
            <image
              class="banner-img"
              :src="item.imgPath"
              style="width: 100%; height: 906rpx"
              :id="'img' + ind"
            ></image>
          </swiper-item>
        </swiper>
        <view v-if="categoryList.length" class="category">
          <view
            v-for="(item, index) in categoryList"
            :key="item.id"
            @click="categoryClick(item, index)"
            class="category-item"
          >
            <image class="category-logo" :src="item.logoImg" />
            <view class="category-name am-text-eill">{{ item.name }}</view>
          </view>
        </view>
        <view class="category-box"></view>
      </view>
      <view class="box-child">
        <view class="activity-charge">
          <view class="activity" @click="inviteClick">
            <view class="activity-bg">
              <view class="activity-text">
                <view class="activity-title">邀请得奖金</view>
              </view>
            </view>
          </view>
          <view class="charge" @click="chargeClick">
            <view class="charge-bg">
              <view class="charge-text">
                <view class="charge-title">任务专拍</view>
              </view>
            </view>
          </view>
        </view>
        <view @click="goPoints" class="points-box">
          <image
            class="points-image"
            src="https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/10/18/35cc78f238cc4360a5504bb4022e9755酷币抵现金@2x.png"
            mode="scaleToFill"
          />
          <text class="points-text">积分可抵用现金</text>
        </view>
        <!-- 今日抢购 -->
        <view class="goods-cord">
          <view
            style="position: relative; padding-top: 80rpx"
            class="goods-data"
          >
            <image
              class="today-flash__sale"
              src="https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/11/07/671883dc3a4d4aaab1048ca7f5225abb新人专区@2x.png"
              mode="scaleToFill"
            />
            <view
              @click="goProduct({ type: '0', title: '今日抢购' })"
              class="more"
              >更多</view
            >
            <view style="padding: 0" class="goods-data-wrap ms">
              <view
                class="goods-card-list"
                v-for="(item, index) in dataList1"
                :key="item.pid"
              >
                <goodsCardSmall
                  :url="`/pages/goods-details/goods-details?id=${item.id}`"
                  :cover="item.banner.split(',')[0]"
                  :title="item.name"
                  :price="reGoodsPrice(item)"
                  :detail="item"
                  @addCart="apiAddCart"
                ></goodsCardSmall>
              </view>
            </view>
          </view>
        </view>
        <!-- 热卖排行 -->
        <view class="title-box">
          <view class="title-left"> 热卖排行 </view>
          <view
            @click="goProduct({ hotSalesRanking: 1, title: '热卖排行' })"
            class="title-right"
            >更多</view
          >
        </view>
        <view class="goods-data-wrap">
          <view
            class="goods-card-list"
            v-for="(item, index) in dataList2"
            :key="item.pid"
          >
            <goods-card
              :url="`/pages/goods-details/goods-details?id=${item.id}`"
              :cover="item.banner.split(',')[0]"
              :title="item.name"
              :price="reGoodsPrice(item)"
              :detail="item"
              @addCart="apiAddCart"
            ></goods-card>
          </view>
        </view>
        <!-- 新品首发 -->
        <view class="title-box">
          <view class="new-product-box">
            <view class="product-launch">
              <view>
                <text style="color: #f14141">新品</text>
                首发
              </view>
              <view
                @click="goProduct({ newPublish: 1, title: '新品首发' })"
                class="title-right"
                >更多</view
              >
            </view>
            <view class="new-product">
              <goodsCardSmall
                v-for="(item, index) in dataList3"
                :url="`/pages/goods-details/goods-details?id=${item.id}`"
                :cover="item.banner.split(',')[0]"
                :title="item.name"
                :price="reGoodsPrice(item)"
                :detail="item"
                @addCart="apiAddCart"
                :isShow="true"
              ></goodsCardSmall>
            </view>
          </view>
        </view>
        <view class="title-box">
          <view class="title-left">
            店长推荐
            <!-- <image
              class="left-image"
              src="https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/10/19/6927a4fc7a2b4e1ea8a8c5c1f55d93feSnipaste_2024-10-19_11-22-29.png"
              mode="scaleToFill"
            /> -->
          </view>
          <view
            @click="goProduct({ type: 1, title: '店长推荐' })"
            class="title-right"
            >更多</view
          >
        </view>
        <view class="goods-data-wrap">
          <view
            class="goods-card-list"
            v-for="(item, index) in dataList4"
            :key="item.pid"
          >
            <goodsCardSmall
              :url="`/pages/goods-details/goods-details?id=${item.id}`"
              :cover="item.banner.split(',')[0]"
              :title="item.name"
              :price="reGoodsPrice(item)"
              :detail="item"
              @addCart="apiAddCart"
            ></goodsCardSmall>
          </view>
        </view>
      </view>
      <view class="contact-us">
        <button class="contact-us-btn" open-type="contact">
          <u-icon name="kefu-ermai" color="#2979ff" size="50"></u-icon>
        </button>
      </view>
      <u-popup mode="center" v-model="showSwiper" @close="close">
        <view class="pop-box">
          <swiper
            :indicator-dots="indicatorDots"
            class="swiper"
            style="width: 343px; height: 453px"
            :autoplay="autoplay"
            :interval="interval"
            :duration="duration"
          >
            <swiper-item
              v-for="(item, ind) in advertisement"
              :key="item.id"
              @click="goDetail(item)"
            >
              <image
                class="banner-img"
                :src="item.imgPath"
                style="width: 343px; height: 453px"
                :id="'img' + ind"
              >
              </image>
            </swiper-item>
          </swiper>
          <image
            class="icon"
            @click="close"
            src="https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/11/07/4f21d4ea8f35437b8bd806f5779d2c21新图网_弹窗关闭icon_ixintu.com.png"
            style="width: 45rpx; height: 45rpx"
          >
          </image>
        </view>
      </u-popup>
    </view>
  </view>
</template>

<script>
import { getList as apiGetList, bannerProxyQueryPage } from '@/api/goods.js'
import {
  navigationHeight,
  navBarHeight,
  menuPlaceWidth
} from '@/utils/systemInfo.js'
import goodsCardSmall from '@/components/goods-card-small/goods-card-small'
import goodsCard from '@/components/goods-card/goods-card'
import { NAV_BAR_TITLE } from '@/types/navbar.js'
import { apiAddCart } from '@/api/shoppingCart'
import { levelToPriceField } from '@/types/goods.js'
import { UPDATE_SHOPPING_CART } from '@/types/globalEventName'
import tabbarPage from '@/mixins/tabbarPage'
import { apiCategoryGoods } from '@/api/goods'
import UImage from '../../uview-ui/components/u-image/u-image.vue'
// 不允许请求的type
const noRequestType = [1, 2, 3]
export default {
  options: {
    styleIsolation: 'apply-shared'
  },
  components: { goodsCardSmall },
  data() {
    return {
      advertisement: [],
      showSwiper: false,
      swiperHeight: 0,
      bannerList: [],
      indicatorDots: true,
      autoplay: true,
      interval: 2000,
      duration: 500,
      dataList1: [],
      dataList2: [],
      dataList3: [],
      dataList4: [],
      // 加载状态
      loadingType: 999,
      // 网络错误
      networkError: false,
      pageNum: 1, // 当前页数
      searchKeyword: '', // 搜索关键字
      realSearchKeyword: '',
      NAV_BAR_TITLE,
      navbarBackground: {},
      navigationHeight,
      navBarHeight,
      menuPlaceWidth,
      categoryList: [],
      searchActionStyle: {
        color: '#fff',
        fontSize: '32rpx'
      },
      listBannerList: [],
      pageShow: true
    }
  },
  mixins: [tabbarPage],
  computed: {
    curSupplierLevel() {
      return this.$store.getters.curSupplierLevel
    }
  },
  created() {
    this.getBannerList()
    this.getListBannerList()
    this.getCategoryList()
    this.unlockInit()
    this.$store.dispatch('updateUserinfo')
    if (!uni.getStorageSync('needShowPopup')) {
      bannerProxyQueryPage({ banner: 2 }).then((res) => {
        if (res.data.code == 200) {
          this.advertisement = res.data.data || []
          this.advertisement.length ? (this.showSwiper = true) : ''
        }
      })
    }
  },
  watch: {},
  onHide() {},
  onLoad() {
    // setTimeout(() => {
    //   const query = uni.createSelectorQuery()
    //   query
    //     .select('#img0')
    //     .boundingClientRect((data) => {
    //       const getSystemInfo = uni.getSystemInfoSync()
    //       const { windowWidth, windowHeight } = getSystemInfo //屏幕可视宽高
    //       const { width, height } = data // 图片信息的实际宽高
    //       let imageAdapt = (height * windowWidth) / width //计算根据宽度的自适应的高度
    //       this.swiperHeight = imageAdapt
    //     })
    //     .exec()
    // }, 500)
  },
  onPullDownRefresh() {
    this.unlockInit()
  },
  onReachBottom() {
    this.getList()
  },
  onShareAppMessage() {},
  onShareTimeline() {},
  methods: {
    close() {
      this.showSwiper = false
      uni.setStorageSync('needShowPopup', 'true')
    },
    goProduct(obj) {
      uni.navigateTo({
        url: `/pages/category/listCard?data=${JSON.stringify(obj)}`
      })
    },
    goPoints() {
      this.$u.route('/pages/category/secondCategory')
    },
    goDetail(v) {
      if (!v.jumpLink) {
        return
      }
      if (v.skipType == 0) {
        uni.navigateTo({
          url: `/pages/goods-details/goods-details?id=${v.jumpLink}`
        })
      } else if (v.skipType == 1) {
        this.$u.route({
          url: '/pages/pre-sale/pre-sale-details',
          params: {
            id: v.jumpLink
          }
        })
      }
    },
    categoryClick(item, index) {
      this.$u.route('/pages/category/secondCategory', {
        firstIndex: index == 7 ? -1 : index
      })
    },
    inviteClick() {
      this.$u.route('/pages/mine/invitations')
    },
    chargeClick() {
      this.$u.route(`/pages/goods-details/goods-details?id=${15}`)
    },
    getCategoryList() {
      apiCategoryGoods()
        .then((res) => {
          let { state, data, msg } = res.data
          if (state === 'OK') {
            this.categoryList = data[0].categoryEntityVOS.slice(0, 7)
            if (data[0].categoryEntityVOS.length > 7) {
              this.categoryList.push({
                name: '全部',
                cid: '',
                logoImg:
                  'https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/12/09/2f2de3a0958943e1a1ff35cfd852b4f3微信图片_20241209151802.jpg'
              })
            }
          } else {
            uni.hideLoading()
            this.$am_toast(msg)
          }
        })
        .catch((err) => {
          console.log(err)
          uni.hideLoading()
          this.$am_toast.error('查询失败')
        })
    },
    getBannerList() {
      bannerProxyQueryPage({ banner: 0 }).then((res) => {
        console.log(res)
        if (res.data.code == 200) {
          this.bannerList = res.data.data
        }
      })
    },
    getListBannerList() {
      bannerProxyQueryPage({ banner: 1 }).then((res) => {
        console.log(res, '==-=-=--=-')
        if (res.data.code == 200) {
          this.listBannerList = res.data.data
        }
      })
    },
    unlockInit() {
      console.log('4534543')
      // this.loadingType = 999
      this.pageNum = 1
      this.getList()
    },
    getList() {
      if (noRequestType.includes(this.loadingType)) {
        return
      }
      this.networkError = false
      this.loadingType = 2
      console.log('调用获取数据')

      apiGetList({
        pageNum: this.pageNum,
        pageSize: 10,
        name: this.realSearchKeyword,
        type: '0'
      })
        .then(({ data }) => {
          if (data.state === 'OK') {
            this.dataList1 = data.data.list.slice(0, 6)
            console.log(this.dataList, '_+_++_+_')
          }
          uni.stopPullDownRefresh()
        })
        .catch((err) => {
          console.log(err)
          if (err && err.errMsg === 'request:fail ') {
            this.networkError = true
          }
          // this.loadingType = 999
          this.$am_toast.warning('查询失败，请重新尝试！')
          // uni.stopPullDownRefresh()
        })

      apiGetList({
        pageNum: this.pageNum,
        pageSize: 10,
        name: this.realSearchKeyword,
        hotSalesRanking: 1
      })
        .then(({ data }) => {
          if (data.state === 'OK') {
            this.dataList2 = data.data.list.slice(0, 6)
            console.log(this.dataList, '_+_++_+_')
          }
          uni.stopPullDownRefresh()
        })
        .catch((err) => {
          console.log(err)
          if (err && err.errMsg === 'request:fail ') {
            this.networkError = true
          }
          // this.loadingType = 999
          this.$am_toast.warning('查询失败，请重新尝试！')
          // uni.stopPullDownRefresh()
        })
      apiGetList({
        pageNum: this.pageNum,
        pageSize: 10,
        name: this.realSearchKeyword,
        newPublish: 1
      })
        .then(({ data }) => {
          if (data.state === 'OK') {
            this.dataList3 = data.data.list.slice(0, 6)
            console.log(this.dataList, '_+_++_+_')
          }
          uni.stopPullDownRefresh()
        })
        .catch((err) => {
          console.log(err)
          if (err && err.errMsg === 'request:fail ') {
            this.networkError = true
          }
          // this.loadingType = 999
          this.$am_toast.warning('查询失败，请重新尝试！')
          // uni.stopPullDownRefresh()
        })
      apiGetList({
        pageNum: this.pageNum,
        pageSize: 10,
        name: this.realSearchKeyword,
        type: 1
      })
        .then(({ data }) => {
          if (data.state === 'OK') {
            this.dataList4 = data.data.list.slice(0, 6)
            console.log(this.dataList, '_+_++_+_')
          }
          uni.stopPullDownRefresh()
          this.pageShow = false
        })
        .catch((err) => {
          console.log(err)
          if (err && err.errMsg === 'request:fail ') {
            this.networkError = true
          }
          // this.loadingType = 999
          this.$am_toast.warning('查询失败，请重新尝试！')
          // uni.stopPullDownRefresh()
        })
    },
    // 搜索框点击搜索
    searchInputHandle(e) {
      console.log(e)
      if (this.realSearchKeyword !== e) {
        this.realSearchKeyword = e
        this.unlockInit()
      }
    },
    // 添加商品到购物车
    apiAddCart(data) {
      uni.showLoading({
        mask: true
      })
      apiAddCart(data)
        .then((res) => {
          let { state, msg } = res.data
          uni.hideLoading()
          if (state === 'OK') {
            uni.$emit(UPDATE_SHOPPING_CART)
            this.$store.dispatch('getCartNum')
            this.$am_toast.success('成功添加购物车')
            this.$store.dispatch('getNoticeData')
          } else {
            this.$am_toast(msg)
          }
        })
        .catch((err) => {
          uni.hideLoading()
          this.$am_toast.error('添加失败，请重新尝试！')
        })
    },
    goBuy(id) {
      this.$u.route('pages/place-order/submit-order', { ids: id })
    },
    reGoodsPrice(item) {
      return item.skuChildList[0].purchasePrice
    }
  }
}
</script>

<style lang="scss" scoped>
$page-plr: 32rpx;

.page-header-bar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 750rpx;
  height: 380rpx;
  background-image: url('https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/09/19/28d4e3a88d71459280563655af959dfe上面底部.png');
  background-repeat: repeat-x;
  background-size: cover;
}

.navbar-title-img {
  display: block;
  width: 174rpx;
  height: 37rpx;
}

.navbar-slot-wrap {
  // position: absolute;
  width: 174rpx;
  margin-left: 24rpx;
}

.search-content {
  height: 84rpx;
  display: flex;
  align-items: center;
  padding-left: 16rpx;
  padding-right: 16rpx;
}

.search-bar-place {
  height: 84rpx;
}

.select-supplier-box {
  flex: 1;
  padding-right: 16rpx;
}

.select-supplier-icon {
  margin-right: 10rpx;
}

.select-supplier-con {
  flex: 1;
  width: 0;
}

.select-supplier-name {
  color: #fff;
  font-size: 34rpx;
  font-weight: 500;
}

.search-content-con {
  flex: 1;
  width: 0;
}

.goods-data-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 16rpx $page-plr;
  padding-bottom: 0rpx;
}

.navbar-title-img {
  display: block;
  width: 174rpx;
  height: 37rpx;
}

.banner_wrap {
  position: relative;
}

.logo {
  position: absolute;
  left: 24rpx;
  top: 120rpx;
  z-index: 1;
}

.wx-name {
  margin-left: 40rpx;
  width: 160rpx;
  height: 54rpx;
  font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
  font-weight: 900;
  font-size: 40rpx;
  color: #1a1a1a;
  line-height: 54rpx;
  text-align: left;
  font-style: normal;
  text-transform: none;
}

.category {
  width: 100%;
  height: 384rpx;
  position: absolute;
  bottom: 20rpx;
  display: flex;
  flex-wrap: wrap;
  padding: 24rpx 50rpx;
  background: #ffffff;
  font-size: 24rpx;
  color: #1d2129;
  line-height: 34rpx;
  text-align: center;
  border-radius: 32rpx;
}

.category-box {
  height: 364rpx;
  background: #ffffff;
  font-size: 24rpx;
  color: #1d2129;
  line-height: 34rpx;
  text-align: center;
  border-radius: 32rpx;
}

.category-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 70rpx;
  margin-top: 24rpx;
}

.category-item:nth-of-type(4n + 0) {
  margin-right: 0;
}

.category-logo {
  width: 110rpx;
  height: 110rpx;
  border-radius: 50%;
  object-fit: cover;
}

.category-name {
  width: 110rpx;
}

.activity-charge {
  display: flex;
  align-items: center;
  padding: 8rpx 32rpx;
  margin: 16rpx 0;
  background-color: #fff;
  margin-bottom: 0;
}

.activity {
  position: relative;
}

.activity-text {
  position: absolute;
  left: 28rpx;
  top: 80rpx;
}

.activity-bg {
  width: 358rpx;
  height: 146rpx;
  background-image: url('https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/10/18/9e60cc6a4125460e9ec7f8db5b86692binvite.png');
  background-repeat: repeat-x;
  background-size: cover;
  border-radius: 16rpx;

  .activity-title {
    margin-top: 10rpx;
    width: 144rpx;
    height: 44rpx;
    font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
    font-weight: 700;
    font-size: 20rpx;
    line-height: 44rpx;
    color: #fc843b;
  }
}

.charge {
  position: relative;
}

.charge-text {
  position: absolute;
  left: 30rpx;
  top: 72rpx;
}

.charge-bg {
  width: 346rpx;
  height: 132rpx;
  background-image: url('https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/11/12/25960fdb63214b0698f69ee08b934ab8爱心传递@3x.png');
  background-repeat: repeat-x;
  background-size: cover;
  border-radius: 16rpx;

  .charge-title {
    margin-top: 10rpx;
    width: 144rpx;
    height: 44rpx;
    font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
    font-weight: 700;
    font-size: 20rpx;
    line-height: 44rpx;
    color: #96672e;
  }
}

.box-child {
  background: #f5f5f5;
}

.banner-img {
  border-radius: 16rpx;
}

.list-banner-img {
  border-radius: 16rpx;
  object-fit: cover;
}

.points-box {
  position: relative;
  padding: 0 32rpx;
  background-color: #fff;

  .points-image {
    width: 692rpx;
    height: 160rpx;
  }

  .points-text {
    position: absolute;
    left: calc(50% - (70px / 2));
    bottom: 52rpx;
    font-size: 20rpx;
    color: #fff;
  }
}

.title-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24rpx 32rpx 8rpx 32rpx;

  .title-left {
    display: flex;
    align-items: center;
    color: #000000;
    font-size: 40rpx;
    font-weight: 500;
  }

  .left-image {
    width: 100rpx;
    height: 50rpx;
    margin-left: 10rpx;
  }

  .title-right {
    color: #aeaeae;
    font-size: 24rpx;
  }
}

.today-flash__sale {
  width: 116.33rpx;
  height: 58rpx;
  position: absolute;
  top: 26rpx;
  left: -10rpx;
}

.recommend {
  position: relative;
}

.goods-data {
  background-image: url('https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/11/07/b6b48bbb84504cf49933d9ce379a0791矩形 18048@2x.png');
  background-size: cover;
  /* 背景图片覆盖整个元素 */
  background-repeat: no-repeat;
  /* 背景图片不重复 */
  background-position: center;
  /* 背景图片居中 */
  padding: 16rpx $page-plr;
  border-radius: 25rpx;
}

.goods-cord {
  padding: 16rpx $page-plr;
}

.new-product {
  display: flex;
  margin-top: 20rpx;
  flex-wrap: wrap;
  justify-content: space-between;

  ::v-deep {
    .goods-card {
      width: 206rpx !important;
      // height: 280rpx !important;
    }

    .goods-card__img,
    .goods-card__cover {
      width: 182.59rpx !important;
      height: 188rpx !important;
    }
  }
}

.ms {
  ::v-deep {
    .goods-card {
      width: 308rpx;
    }

    .goods-card__img {
      width: 274.4rpx;
    }
  }
}

.more {
  position: absolute;
  top: 24rpx;
  right: 24rpx;
  font-weight: 400;
  font-size: 24rpx;
  color: #ffffff;
}

.product-launch {
  display: flex;
  justify-content: space-between;
  font-weight: 500;
  font-size: 32rpx;
  color: #f14141;
}

.new-product-box {
  width: 100%;
  background-image: url('https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/11/07/dc4c5bedbd154f64b4ffa6084fff900b矩形 18049@2x.png');
  background-size: cover;
  /* 背景图片覆盖整个元素 */
  background-repeat: no-repeat;
  /* 背景图片不重复 */
  background-position: center;
  /* 背景图片居中 */
  padding: 16rpx $page-plr;
  border-radius: 25rpx;
}

.price-icon {
  width: 76rpx;
  height: 32rpx;
  line-height: 32rpx;
  background: url('https://kc-glasses-mall-langjing.oss-cn-chengdu.aliyuncs.com/2024/10/08/ab03b57d944447c4917ccb80894b5b87tag.png');
  background-repeat: repeat-x;
  background-size: cover;
  font-size: 20rpx;
  text-align: center;
  color: #fff;
}

.price-unit {
  display: inline-block;
  margin: 0 6rpx;
  font-size: 24rpx;
  color: #ec5d29;
}

.goods-card__unit-price {
  display: block;
  font-weight: 600;
  font-family: PingFang SC, PingFang SC;
  font-size: 40rpx;
  color: #ec5d29;
  line-height: 48rpx;
  text-align: left;
}

.original-price-identification,
.original-price {
  font-weight: 400;
  font-size: 20rpx;
  color: #c5c6c8;
  text-decoration: line-through;
}

.pop-box {
  width: 343px;
  height: 453px;
  background-color: rgba($color: #000000, $alpha: 0);
  // position: relative;
}

.icon {
  position: fixed;
  bottom: 13%;
  left: 48%;
}

::v-deep {
  .banner-img {
    border-radius: 0 !important;
  }
}
.loading-wrap {
  height: 100vh;
}
.contact-us {
  position: fixed;
  right: 5rpx;
  bottom: 200rpx;
}
.contact-us-btn {
  background: transparent;
  border: none;
  color: rgb(77, 77, 158);
  font-size: 28rpx;
  padding: 0;
}
.contact-us-btn::after {
  display: none !important;
}
.contact-us-icon {
  width: 50rpx;
  height: 50rpx;
}
</style>
